<!--
////////////////////////////////////////////////////////////////////////////////
//
//  Copyright 2007 humbroll.  All rights reserved.
//
////////////////////////////////////////////////////////////////////////////////
-->

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>OpenBrain flyout</title>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <link href="css/flyout.css" rel="stylesheet" type="text/css" />
    <script type="text/javascript" src="core/js/core.js"></script>
	<script type="text/javascript" src="js/gadget.js"></script>
	<script type="text/javascript" src="js/flyout.js"></script>
	<script type="text/javascript" src="js/main.js"></script>
	<script type="text/javascript" src="js/ajaxEngine.js"></script>
	<script type="text/javascript" src="js/queryEngine.js"></script>
	<script type="text/javascript" src="js/auth.js"></script>
	<script src="js/alert.vbs" type="text/vbscript"></script>
	<script type="text/javascript">
		var m_gadget = System.Gadget.document.parentWindow;
		var M_OPENID = m_gadget.M_OPENID;
		var M_USERKEY = m_gadget.M_USERKEY;
		var m_appKeyName = m_gadget.M_APPKEYNAME;
		var m_ajaxEngine = m_gadget.M_AJAXENGINE;
		var m_queryEngine = new queryEngine();//m_gadget.M_QUERY;
		var m_temp = "";
		//event method=========================================================
		function onGoClick(p_id){
			var m_query = m_queryEngine.makeGetPageQuery(p_id);
			m_ajaxEngine.openXHR("GET",m_query,showContent);			
		}
		function onBackwardClick(){
			document.getElementById('contentlist').style.display = 'inline';
			document.getElementById('content').style.display = 'none';
		}
		function onUpdateClick(){
			var m_title = document.getElementById('resulttitle').innerText;
			var m_content = document.getElementById('resultcontent').innerText;
			document.getElementById('content').style.display = 'none';
			document.getElementById('updatelayout').style.display = 'inline';
			document.getElementById('updatetitle').value = m_title;
			document.getElementById('updatecontent').value = m_content;
		}
		function onUpdateOkClick(){
			var m_query = m_queryEngine.makeGetPageQuery(m_temp);
			var m_title = document.getElementById('updatetitle').value;
			var m_content = document.getElementById('updatecontent').value;
			var m_content_xml = m_queryEngine.makeAddXMLPageQuery(m_title,m_content);
			m_ajaxEngine.openXHR("PUT",m_query,showContent,m_content_xml);
		}
		function onUpdateCancelClick(){
			document.getElementById('updatelayout').style.display = 'none';
			document.getElementById('content').style.display = 'inline';
		}
		function onDeleteClick(p_id){
			var m_id = p_id;
			if(m_id == null){
				m_id = m_temp;
			}
			var m_answer = confirm("Are you sure? - DELETE");
			if(m_answer){
				var m_query = m_queryEngine.makeGetPageQuery(m_id);
				m_ajaxEngine.openXHR("DELETE",m_query,resultDelete);
			}
		}
		//=====================================================================
		//callback method======================================================
		function showContent(p_result){
			var m_confirm = "";
			m_confirm = errorHandler(p_result);
			if(m_confirm != "noerror"){
				alert(m_confirm)
				return;
			}
			var m_list_element = document.getElementById('contentlist');
			var m_content_element = document.getElementById('content');
			var m_update_element = document.getElementById('updatelayout');
			var m_content = p_result.getElementsByTagName("source")[0].firstChild.nodeValue;
			var m_title = p_result.getElementsByTagName("title")[0].firstChild.nodeValue;
			m_temp = p_result.getElementsByTagName("identifier")[0].firstChild.nodeValue;
			m_list_element.style.display = "none";
			m_content_element.style.display = "inline";
			m_update_element.style.display = "none";
			
			document.getElementById('resulttitle').innerText = m_title;
			document.getElementById('resultcontent').innerHTML = m_content;

			var m_updateButton = document.getElementById('update');
			m_updateButton.onclick = onUpdateClick;
			var m_deleteButton = document.getElementById('delete');
			m_deleteButton.onclick = onDeleteClick;
		}
		function resultDelete(p_result){
			var m_confirm = errorHandler(p_result);
			if(m_confirm != "noerror"){
				alert(m_confirm);
				return;
			}
			alert("SUCCESS DELETE!");
			doProcFlyoutClose();
		}
		//=====================================================================
	</script>
</head>
<body onload="loadFlyout();" dir="ltr" style="overflow:auto;">
	<div id="contentlist">
		loading....
   	</div>
	<div id="content" style="display:none">
		<button id="backward" onclick="onBackwardClick()"><b>Backward</b></button>
		&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp
		<button id="update" style="width:100"><b>UPDATE</b></button>
		<button id="delete" style="width:100"><b>DELETE</b></button><br/>
		<label for="resulttitle"><b>Title : </b></label>
		<span id="resulttitle"></span><br/>
		<fieldset>
			<legend><b>Content</b></legend>
			<div id="resultcontent"></div>
		</fieldset>
	</div>
	<div id="updatelayout" style="display:none;">
			<label for="updatetitle" >Title : </label><input type="text" id="updatetitle" name="updatetitle" size=50 ></input>
			<br/>
			<fieldset>
				<legend>Content</legend>
				<textarea rows="18" cols="40" id="updatecontent" name="updatecontent"></textarea>					
			</fieldset>
			<div align="right">
				<button id="updateok" name="updateok" onclick="onUpdateOkClick();" style="width:100"><b>OK</b></button>	
				<button id="updatecancel" name="updatecancel" onclick="onUpdateCancelClick();" style="width:100"><b>Cancel</b></button>
			</div>
	</div>
</body>
</html>